<template>
	<view class="container">
		<view class="filter-bar">
			<u-tabs :list="statusTabs" :current="currentStatus" @change="statusChange"></u-tabs>
		</view>
		<view class="apply-list">
			<u-card v-for="(item, index) in applyList" :key="index" :title="item.vacancyName" :sub-title="'申请时间:' + new Date(item.applyTime).toLocaleString()">
				<view slot="body">
					<view class="info-item">
						<text class="label">申请人：</text>
						<text>{{item.userName}}</text>
					</view>
					<view class="info-item">
						<text class="label">联系电话：</text>
						<text>{{item.userPhone}}</text>
					</view>
					<view class="info-item">
						<text class="label">申请状态：</text>
						<text :class="['status', getStatusClass(item.status)]">{{item.status}}</text>
					</view>
					<view class="info-item" v-if="item.status === '拒绝'">
						<text class="label">拒绝原因：</text>
						<text class="reject-reason">{{item.rejectReason || '无'}}</text>
					</view>
				</view>
				<view slot="foot" class="card-foot">
					<u-button v-if="item.status === '待审核'" type="primary" size="mini" @click="showApproveDialog(item)">通过</u-button>
					<u-button v-if="item.status === '待审核'" type="error" size="mini" @click="showRejectDialog(item)">拒绝</u-button>
					<u-button type="info" size="mini" @click="viewResume(item.userId)">查看简历</u-button>
					<u-button type="success" size="mini" @click="contactUser(item)">联系求职者</u-button>
				</view>
			</u-card>
		</view>
		<u-loadmore :status="loadStatus" />
		
		<!-- 拒绝原因弹窗 -->
		<u-popup v-model="showRejectPopup" mode="center" width="80%" :closeable="true">
			<view class="reject-popup">
				<view class="popup-title">请输入拒绝原因</view>
				<textarea v-model="rejectReason" placeholder="请输入拒绝原因（选填）" class="reject-textarea"></textarea>
				<view class="popup-btns">
					<u-button type="error" size="mini" @click="confirmReject">确认拒绝</u-button>
				</view>
			</view>
		</u-popup>
		
		<!-- 通过确认弹窗 -->
		<u-popup v-model="showApprovePopup" mode="center" width="80%" :closeable="true">
			<view class="approve-popup">
				<view class="popup-title">确认通过</view>
				<view class="popup-content">确定要通过该简历申请吗？</view>
				<view class="popup-btns">
					<u-button type="primary" size="mini" @click="confirmApprove">确认通过</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
import { applyList, reviewApply } from '@/utils/api/modules/vacancy.js'

export default {
	data() {
		return {
			applyList: [],
			pageNum: 1,
			pageSize: 10,
			loadStatus: 'loading',
			loading: false,
			finished: false,
			currentStatus: 0,
			statusTabs: [
				{ name: '全部' },
				{ name: '待审核' },
				{ name: '已通过' },
				{ name: '已拒绝' }
			],
			showRejectPopup: false,
			showApprovePopup: false,
			rejectReason: '',
			currentApplyId: null
		}
	},
	onLoad() {
		this.loadData();
	},
	onPullDownRefresh() {
		this.pageNum = 1;
		this.applyList = [];
		this.finished = false;
		this.loadData();
	},
	onReachBottom() {
		if (!this.finished && !this.loading) {
			this.loadData();
		}
	},
	methods: {
		statusChange(index) {
			this.currentStatus = index;
			this.pageNum = 1;
			this.applyList = [];
			this.finished = false;
			this.loadData();
		},
		async loadData() {
			if (this.loading || this.finished) return;
			this.loading = true;
			this.loadStatus = 'loading';
			
			try {
				const statusMap = ['', '待审核', '通过', '拒绝'];
				const res = await applyList({
					userId: uni.getStorageSync('user').id,
					pageNum: this.pageNum,
					pageSize: this.pageSize,
					status: statusMap[this.currentStatus]
				});
				
				if (res.statusCode == 200) {
					const { records, total } = res.data;
					this.applyList = [...this.applyList, ...records];
					this.finished = this.applyList.length >= total;
					this.pageNum++;
				}
			} catch (error) {
				console.error('加载申请列表失败：', error);
				uni.showToast({
					title: '加载失败',
					icon: 'none'
				});
			} finally {
				this.loading = false;
				this.loadStatus = this.finished ? 'nomore' : 'loadmore';
				uni.stopPullDownRefresh();
			}
		},
		async reviewApply(id, status) {
			try {
				const res = await reviewApply({
					id,
					status,
					rejectReason: status === '拒绝' ? this.rejectReason : ''
				});
				
				if (res.code == 200) {
					uni.showToast({
						title: '审核成功',
						icon: 'success'
					});
					setTimeout(()=>{
						window.location.reload()
					},800)
					this.applyList = [];
					this.pageNum = 1;
					this.finished = false;
					this.loadData();
					
				}
			} catch (error) {
				console.error('审核失败：', error);
				uni.showToast({
					title: '审核失败',
					icon: 'none'
				});
			}
		},
		showRejectDialog(item) {
			this.currentApplyId = item.id;
			this.rejectReason = '';
			this.showRejectPopup = true;
		},
		confirmReject() {
			if (this.currentApplyId) {
				this.reviewApply(this.currentApplyId, '拒绝');
				this.showRejectPopup = false;
			}
		},
		showApproveDialog(item) {
			this.currentApplyId = item.id;
			this.showApprovePopup = true;
		},
		confirmApprove() {
			if (this.currentApplyId) {
				this.reviewApply(this.currentApplyId, '通过');
				this.showApprovePopup = false;
			}
		},
		viewResume(userId) {
			uni.navigateTo({
				url: `/pages/mine/personal?id=${userId}`
			});
		},
		contactUser(item) {
			uni.navigateTo({
				url: `/pages/message/message-detail?id=${item.userId}&otherNickName=${item.userName}`
			});
		},
		getStatusClass(status) {
			const classMap = {
				'待审核': 'status-pending',
				'通过': 'status-approved',
				'拒绝': 'status-rejected'
			};
			return classMap[status] || '';
		}
	}
}
</script>

<style>
.container {
	padding: 20rpx;
	background-color: #f5f5f5;
	min-height: 100vh;
}

.filter-bar {
	background-color: #fff;
	margin-bottom: 20rpx;
	border-radius: 12rpx;
}

.apply-list {
	margin-top: 20rpx;
}

.info-item {
	margin-bottom: 16rpx;
	display: flex;
	align-items: center;
	font-size: 28rpx;
}

.label {
	color: #666;
	margin-right: 10rpx;
	min-width: 140rpx;
}

.status {
	padding: 4rpx 12rpx;
	border-radius: 4rpx;
	font-size: 24rpx;
}

.status-pending {
	color: #ff9900;
	background-color: #fff7e6;
}

.status-approved {
	color: #52c41a;
	background-color: #f6ffed;
}

.status-rejected {
	color: #ff4d4f;
	background-color: #fff1f0;
}

.card-foot {
	display: flex;
	justify-content: flex-end;
	gap: 20rpx;
}

.reject-reason {
	color: #ff4d4f;
	font-size: 26rpx;
}

.reject-popup {
	padding: 30rpx;
}

.popup-title {
	font-size: 32rpx;
	font-weight: bold;
	margin-bottom: 20rpx;
	text-align: center;
}

.reject-textarea {
	width: 100%;
	height: 200rpx;
	border: 1px solid #eee;
	border-radius: 8rpx;
	padding: 20rpx;
	margin-bottom: 30rpx;
	font-size: 28rpx;
}

.popup-btns {
	display: flex;
	justify-content: center;
}

.approve-popup {
	padding: 30rpx;
}

.popup-content {
	font-size: 28rpx;
	color: #666;
	text-align: center;
	margin: 20rpx 0 30rpx;
}
</style> 